<!--
 * @Author: 1453937336@qq.com 1453937336@qq.com
 * @Date: 2024-06-06 15:49:14
 * @LastEditors: 1453937336@qq.com 1453937336@qq.com
 * @LastEditTime: 2024-06-20 17:49:23
 * @FilePath: \itforce-hris\src\pages\home\components\kind-echarts.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <a-row>
      <a-col v-if="genderDataList.length" :span="6">
        <pieChart :height="400" :list="genderDataList" :title="$t('性别比例')" />
      </a-col>
      <a-col v-if="workTermsDataList.length" :span="6">
        <pieChart :height="400" :list="workTermsDataList" :title="$t('本籍外籍比例')" />
      </a-col>
      <a-col v-if="workStausDataList.length" :span="12">
        <histogram :height="400" :list="workStausDataList" :title="$t('员工状态统计')" />
      </a-col>
      <a-col v-if="employeeStausDataList.length" :span="12">
        <histogram :height="400" :list="employeeStausDataList" :title="$t('员工状态统计')" color="#11CCC1"/>
      </a-col>
    </a-row>
  </div>
</template>
<script lang="ts" setup>
import pieChart from './pie-chart'
import histogram from './histogram'
import emitter from "@/utils/bus";
let workStausDataList = ref([])
let genderDataList = ref([])
let workTermsDataList = ref([])
let employeeStausDataList = ref([])
import { GetEmployeeStatic } from '@/api/home/index'
const getEmployeeStatic = async () => {
  const { data } = await GetEmployeeStatic()
  
  workTermsDataList.value = data?.workTermsDataList?.map(i => {
    i.value = i.data
    delete i.data
    return i
  }) ?? []
  genderDataList.value = data?.genderDataList?.map(v => {
    v.value = v.data
    delete v.data
    return v
  }) ?? []

  workStausDataList.value = data?.workStausDataList?.map(k => {
    k.value = k.data
    delete k.data
    return k
  }) ?? []

  employeeStausDataList.value = data?.employeeStausDataList?.map(k => {
    k.value = k.data
    delete k.data
    return k
  }) ?? []
  emitter.emit("employeeNo", data?.employeeCount ?? 0);
}
onMounted(() => {
  getEmployeeStatic()
})
</script>
<style scoped lang="scss"></style>
